<template>
    <div class="search-result">
        <van-list
            v-model="loading"
            :finished="finished"
            finished-text="没有更多了"
            @load="onLoad"
        >
            <van-cell icon="search" v-for="item in list" :key="item" :title="item" />
        </van-list>
    </div>
</template>
<script>
import { getSearchResult } from '@/api/search'
export default {
    name:'search-Result',
    data() {
        return {
            list: [],
            loading: false,
            finished: false
        }
    },
    methods: {
        async onLoad() {
            /*const  data  = await getSearchResult({
                page:1,
                per_page:10,
                q:this.searchText
            })
            console.log(data)
            */
            setTimeout(() => {
                for (let i = 0; i < 10; i++) {
                    this.list.push(this.list.length + 1);
                }

                // 加载状态结束
                this.loading = false;

                // 数据全部加载完成
                if (this.list.length >= 40) {
                    this.finished = true;
                }
            }, 1000);
        }
    },
    props:{
        searchText:{
            type:String,
            required:true
        }
    }
}
</script>
<style lang="less" scoped>
.search-result{
    position: fixed;
    left: 0;
    right: 0;
    top: 54px;
    bottom: 0;
    overflow-y: auto;
}
</style>